<template>
    <div style="background-color: #F5F5F5;">

        <el-container style="width: 70%;margin: 0 auto;">

            <el-header style="background-color:#8FC0A9;height: 65px;display: flex">
                <div @click="goBack">
                    <h3><i class="el-icon-back"></i>返回主页</h3>
                </div>
                <div >
                    <img :src=logoImage style="width: 100px;height: 65px;margin-left: 20px">
                </div>

                <div style="margin-left: 700px" @click="goUser">
                    <h3><i class="el-icon-s-custom"></i>个人中心</h3>
                </div>
            </el-header>

            <el-main style="height: 500px;background-color:#FAF3DD;padding: 80px;text-align: center">
                <h2>确认订单</h2>
                <el-divider></el-divider>
                <div>
                    <h5>商品：{{goodsNameCurrent}}</h5>
                    <h5>数量：{{order.orderHomeAmount}}</h5>
                    <h5>单价：{{order.orderPriceOne}}</h5>
                    <h5>总价：{{order.orderPriceSum }}</h5>
                </div>
                <el-divider></el-divider>

                <el-tooltip class="item" effect="dark" content="直接提交订单到后台，将会消耗你的绿叶余额！" placement="bottom-start">
                    <!--<el-button>上边</el-button>-->
                    <el-button type="danger" @click="submitOrder" plain>提交订单</el-button>
                </el-tooltip>
            </el-main>

            <Footer></Footer>
        </el-container>
    </div>
</template>

<script>
    import Footer from "../components/Footer";
    export default {
        name: "CreateOrder",
        components:{
            Footer,
        },
        data(){
            return{
                logoImage:require("../assets/bgc/logo.png"),
                goodsNameCurrent:'',
                order:{
                    orderName:'',
                    orderHomeUserid:null,
                    orderHomeAmount:'',
                    orderPriceOne:null,
                    orderPriceSum:null,
                    orderBuyUserid:null,
                    orderGoodsId:null,
                }
            }
        },
        methods:{
            goBack(){
                this.$router.push("/");
            },

            goUser(){
                this.$router.push("/user");
            },

            submitOrder(){
                this.$http({
                    method:'POST',
                    url:'http://localhost:8083/goods/placeOrder',
                    params:{
                        "orderName":this.order.orderName,
                        "orderHomeUserid":this.order.orderHomeUserid,
                        "orderHomeAmount":this.order.orderHomeAmount,
                        "orderPriceOne":this.order.orderPriceOne,
                        "orderPriceSum":this.order.orderPriceSum,
                        "orderBuyUserid":this.order.orderBuyUserid,
                        "orderGoodsId":this.order.orderGoodsId,
                    }
                }).then(res=>{
                    console.log(res.data);

                }).catch(err=>{
                    console.log(err);
                })
            }
        }
    }
</script>

<style scoped>

</style>